import QtQuick 2.7
import QtQuick.Window 2.2
import QtQuick.Controls 2.0
import QmlApp.backend 1.0

Window {
    id: root
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")


    BackEnd {
        id: backend
    }

    TextField {
        id: iUserName
        text: backend.userName
        placeholderText: qsTr("User Name")
        anchors.centerIn: parent

        onTextChanged: backend.userName = text
    }

    Button {
        id: iBtn
        text: qsTr("Popup Window")
        anchors {
            top: iUserName.bottom
            topMargin: 20
            horizontalCenter: iUserName.horizontalCenter
        }

        onClicked: {
            var component = Qt.createComponent("AnimationWindow.qml")
            var window    = component.createObject(root)
            window.showNormal();
        }
    }

    AnimationItem {
        anchors.top: parent.top
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.topMargin: 20
    }

    AnimationBehavior {
        anchors.bottom: parent.bottom
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.bottomMargin: 20
    }
}
